import { useUserStore } from '@/stores'
import NProgress from 'nprogress'
import 'nprogress/nprogress.css'
import { showDialog } from 'vant'
import { createRouter, createWebHistory } from 'vue-router'

// NProgress.configure({
//   // showSpinner: false
// })

// createRouter 创建路由实例，===> new VueRouter()
// history 是路由模式，hash模式，history模式
// createWebHistory() 是开启history模块   http://xxx/user
// createWebHashHistory() 是开启hash模式    http://xxx/#/user

// vite 的配置 import.meta.env.BASE_URL 是路由的基准地址，默认是 ’/‘
// https://vitejs.dev/guide/build.html#public-base-path
// 如果将来你部署的域名路径是：http://xxx/my-path/user
// vite.config.ts  添加配置  base: my-path，路由这就会加上 my-path 前缀了

// 路由器实例
const router = createRouter({
  history: createWebHistory(import.meta.env.BASE_URL),
  routes: [
    {
      name: 'LoginIndex',
      path: '/login',
      component: () => import('@/views/Login/index.vue'),
      meta: { title: '登录' }
    },
    {
      name: 'RegisterIndex',
      path: '/register',
      component: () => import('@/views/Register/index.vue'),
      meta: { title: '注册' }
    },
    {
      name: 'LayoutIndex',
      path: '/',
      component: () => import('@/views/Layout/index.vue'),
      redirect: '/home',
      children: [
        {
          name: 'HomeIndex',
          path: '/home',
          component: () => import('@/views/Home/index.vue'),
          meta: { title: '首页' }
        },
        {
          name: 'ArticleIndex',
          path: '/article',
          component: () => import('@/views/Article/index.vue'),
          meta: { title: '健康百科' }
        },
        {
          name: 'NotifyIndex',
          path: '/notify',
          component: () => import('@/views/Notify/index.vue'),
          meta: { title: '消息通知' }
        },
        {
          name: 'UserIndex',
          path: '/user',
          component: () => import('@/views/User/index.vue'),
          meta: { title: '个人中心' }
        }
      ]
    },
    {
      name: 'UserPatient',
      path: '/user/patient',
      component: () => import('@/views/User/PatientPage.vue'),
      meta: { title: '家庭档案' }
    },
    {
      name: 'ConsultFast',
      path: '/consult/fast',
      component: () => import('@/views/Consult/ConsultFast.vue'),
      meta: { title: '极速问诊' }
    },
    {
      name: 'ConsultDep',
      path: '/consult/dep',
      component: () => import('@/views/Consult/ConsultDep.vue'),
      meta: { title: '选择科室' }
    },
    {
      name: 'ConsultIllness',
      path: '/consult/illness',
      component: () => import('@/views/Consult/ConsultIllness.vue'),
      meta: { title: '病情描述' }
    },
    {
      name: 'ConsultPay',
      path: '/consult/pay',
      component: () => import('@/views/Consult/ConsultPay.vue'),
      meta: { title: '问诊支付' }
    },
    {
      name: 'Room',
      path: '/room',
      component: () => import('@/views/Room/index.vue'),
      meta: { title: '问诊室' },
      // 路由独享守卫，进入之前
      beforeEnter(to) {
        console.log('[ to ] >', to)
        // 如果不放过，就直接 return 重定向路由对象 或 地址
        if (to.query.payResult !== 'true') {
          // 这里支持 Promise
          return showDialog({
            message: '支付失败，请去问诊记录中重新尝试支付',
            title: '温馨提示'
          }).then(() => '/user/consult')
        }
      }
    }
  ]
})

const whiteList = ['LoginIndex', 'RegisterIndex']

router.beforeEach((to) => {
  NProgress.start()

  document.title = `优医问诊-${to.meta.title}`

  // Pinia中的数据是会随时变化的，所以这个代码不能提出去，而且提出去后会报错，过早获取仓库实例了
  const userStore = useUserStore()

  if (!userStore.user?.token && !whiteList.includes(to.name as string)) {
    // 补充说明：vue-router@4.x.x 在重定向时，也能进入后置守卫
    return { name: 'LoginIndex' }
  }

  // 不返回，或者 return true，都是放行的意思
})

router.afterEach(() => {
  NProgress.done()
})

export default router
